<template>
  <div id="app">
    <!-- <myTable :mydata='tableData' :myCols='allDate' 
    :total='total' :size='size' :page.sync='myPage' @addNewTable='$refs.myDialogControl.openDialog()'
    @myEmit='handleEmit' @myDelete='handleDelete'> -->
        <!-- 针对日期插槽 -->
        <!-- <template slot="myDate" slot-scope="scope">
          {{scope.myDateData.time*1000|timeChange}}
        </template> -->
        <!-- 针对拼接字符串插槽 -->
        <!-- <template slot="myConbain" slot-scope="scope">
          {{scope.myDateData.name}}+{{scope.myDateData.age}}
        </template>
    </myTable> -->


    <!-- 对话框 -->
    <!-- <myDialog :dialogItem='allDate' @upLoadDate="dialogUpload" ref="myDialogControl">
    </myDialog> -->

    <!-- 用户登录 -->
    <myLogin v-if="!token"></myLogin>
    <router-view v-else></router-view>
  </div>
</template>

<script>


//登录框
import myLogin from '@/components/login.vue'
//引入token，如果存在再显示主页面，否则进入登录界面
import {mapState} from 'vuex'

export default {
  name: 'App',
  components: {
     myLogin:myLogin
  },
  data() {
    return {
      tableData:[
          {ID:1,name:'韦恩少爷',age:25,time:1608170439,password:'11111',sex:'male'},
          {ID:2,name:'阿尔弗雷德',age:24,time:1608256839,password:'12222',sex:'male'},
          {ID:3,name:'蝙蝠骑士',age:26,time:1608343239,password:'1113331',sex:'female'},
          {ID:4,name:'蝙蝠义警',age:24,time:1608429639,password:'133441',sex:'male'},
          {ID:5,name:'蝙蝠侠',age:30,time:1608515524,password:'115t434t1',sex:'female'},
      ],

      // //记录有多少个列
      // tableCols:[
      //   {label:'姓名',prop:'name',align:'center',width:'120'},
      //   {label:'年龄',prop:'age',align:'center'},
      //   {label:'日期',slot:'myDate',align:'center'},
      //   {label:'随便',slot:'myConbain',align:'center'},
      //   {label:'密码',prop:'password',align:'center'}
      // ],
      // //对话框展示的数据
      // dialogItem:[
      //   {label:'姓名',prop:'name',type:'text',
      //   rule:[{ required: true, message: '请输入姓名', trigger: 'blur'}]},
      //   {label:'年龄',prop:'age',type:'number'},
      //   {label:'密码',prop:'password',type:'password'},
      //   {label:'文件',prop:'file',type:'file'}
      // ],
      //数据总得条数
      total:500,
      //每页显示数量
      size:10,
      //当前页
      myPage:5
    }
  },
  computed:{
    ...mapState(['token'])
  },
  methods: {
    handleEmit(item){
      //编辑时将点击内容展示到对话框
      this.$refs.myDialogControl.openDialog(item);
      console.log('这里是编辑',item);
    },
    handleDelete(items){
      console.log('这里是删除',items);
    },
    //记录对话框上传的数据(将来提交就可以在这里提交)
    dialogUpload(item){
      console.log('这里是父组件接收的数据',item);
    }
  },
  watch:{
    myPage:{
      handler(){
        //监听page，一旦发生变化，可以继续读取不同页码的数据
        console.log('数据变了',this.myPage);
      }
    }
  }
}
</script>

<style>

</style>
